<template>
	<view class="zone">
		<Header title="实名认证"></Header>
		<view class="main">
			<image class="yun" src="http://image.qxgm.site/tdz/img/public/m_yun.png" mode="widthFix"></image>
			<image class="ping1" src="http://image.qxgm.site/tdz/img/public/ping1.png" mode="widthFix"></image>
			<view class="box">

				<view class="info">
					<view class="sbox">
						<view class="leftbox">
							<p class="p1">1.微信公众号认证</p>
							<p class="p2">实名认证步骤</p>
							<p class="p3">1.截图保存二维码，使用微信扫一扫关注</p>
							<p class="p3">2.关注成功发送验证码，提示绑定成功即可。</p>

							<view class="yboj">
								<view class="bmb">
									验证码:<text>{{userinfo.invite_code}}</text>
								</view>
								<view class="copy" @click="$p.copy(userinfo.invite_code)">
									{{!userinfo.wx_openid ? '复制去认证':'已认证'}}
								</view>
							</view>
						</view>
						<view class="rightbox" @click="show=true">
							<image class="erweima" src="http://image.qxgm.site/tdz/img/public/weixin.jpg"
								mode="widthFix"></image>
						</view>
					</view>

				</view>
				<view class="info">
					<view class="sbox">
						<view class="leftbox">
							<p class="p1">1.支付宝认证</p>
							<p class="p2">实名认证步骤</p>
							<p class="p3">1.点击前往跳转支付宝</p>
							<p class="p3">2.支付宝页面点击确认</p>
						</view>
						<view class="rightbox2">
							<image class="erweima" src="http://image.qxgm.site/tdz/img/shiming/mg-03.png"
								mode="widthFix"></image>
							<text>免费认证</text>
						</view>
					</view>

					<view class="link">
						<image class="simg" src="http://image.qxgm.site/tdz/img/shiming/mg-04.png" mode="widthFix">
						</image>
						<view class="jobx">
							<p class="jp1">点击支付宝认证</p>
						</view>
						<u-button :plain="true" :hair-line="false" hover-class="none" :throttle-time="1000"
							class="getLevel" @click="ali">{{userinfo.ali_id!=null?'已认证':'前往认证'}}</u-button>
					</view>
				</view>


				<view class="info">
					<p>当前：<text class="hui">{{userinfo.is_check==0?'未完成认证':'已完成认证'}}</text> </p>
				</view>

				<view class="info">
					<view class="tis">
						游戏认证
					</view>

					<view class="part">
						<image class="pimg" src="http://image.qxgm.site/tdz/img/shiming/mg-06.png" mode="widthFix">
						</image>
						<view class="pbox">
							<p class="jp1">传奇游戏达到160级</p>
							<p class="jp2">奖励：赠送超级权限</p>
						</view>
						<u-button :plain="true" :hair-line="false" hover-class="none" :throttle-time="1000"
							class="getLevel" @click="downgame">{{userinfo.game_level>=160?'已认证':'前往认证'}}</u-button>
					</view>


				</view>

			</view>
		</view>

		<u-mask :show="show" @click="show=false">
			<view class="loginimg" @tap.stop>
				<image src="http://image.qxgm.site/tdz/img/public/weixin.jpg" mode="widthFix" class="img"></image>
				<view class="shpj">
					截图保存打开微信扫一扫
				</view>
			</view>
		</u-mask>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				userinfo: uni.getStorageSync('userinfo'),
				show: false,
				val1: 'http://sy.1n.cn/index.php?s=/Home/Index/game_view/promote_id/39517/game_id/3605.html',
			}
		},
		onShow() {
			this.getUserInfo();
		},
		methods: {
			// 请求用户信息接口
			async getUserInfo() {
				let res = await this.$http.index.getUserInfo()
				if (res.code == 1) {
					this.userinfo = res.data
				}
			},
			// 支付宝认证
			ali() {
				if (this.userinfo.ali_id != null) {
					return this.$u.toast('已认证')
				}
				// #ifdef MP-WEIXIN
				if (this.userinfo.ali_id == null) {
					let token = uni.getStorageSync('token')
					let alipayUrl =
						`https://openauth.alipay.com/oauth2/publicAppAuthorize.htm?app_id=2021004135625489&scope=auth_user&redirect_uri=http://tdzh.cpgm8.cn/index.php/api/ali_pay/get_ali_info&state=${token}`

					let openURL = 'alipays://platformapi/startapp?appId=20000067&url=' + encodeURIComponent(alipayUrl);
					location.href = openURL
				} else {
					this.$u.toast('已认证')
				}
				// #endif

				// #ifdef APP-PLUS
				if (this.userinfo.ali_id == null) {
					let token = uni.getStorageSync('token')
					let alipayUrl =
						`https://openauth.alipay.com/oauth2/publicAppAuthorize.htm?app_id=2021004135625489&scope=auth_user&redirect_uri=http://tdzh.cpgm8.cn/index.php/api/ali_pay/get_ali_info&state=${token}`

					let openURL = 'alipays://platformapi/startapp?appId=20000067&url=' + encodeURIComponent(alipayUrl);

					if (this.$u.os() == 'ios') {
						location.href = openURL
					} else if (this.$u.os() == 'android') {
						plus.runtime.openURL(openURL)
					} else {
						location.href = openURL
					}
				} else {
					this.$u.toast('已认证')
				}
				// #endif

				// #ifdef H5
				if (this.userinfo.ali_id == null) {
					let token = uni.getStorageSync('token')
					let alipayUrl =
						`https://openauth.alipay.com/oauth2/publicAppAuthorize.htm?app_id=2021004135625489&scope=auth_user&redirect_uri=http://tdzh.cpgm8.cn/index.php/api/ali_pay/get_ali_info&state=${token}`

					let openURL = 'alipays://platformapi/startapp?appId=20000067&url=' + encodeURIComponent(alipayUrl);
					location.href = openURL
				} else {
					this.$u.toast('已认证')
				}
				// #endif

			},
			// 游戏认证
			downgame() {
				if (this.userinfo.game_level >= 160) {
					this.$u.toast('已认证')
					return
				} else {
					uni.reLaunch({
						url: '/pages/tabbar/game',
						animationType: 'none',
						animationDuration: 10
					})
				}

			},
		}
	}
</script>

<style lang="less">
	.zone {
		min-height: 100vh;
		background: url(http://image.qxgm.site/tdz/img/public/p_bg.png) no-repeat;
		background-size: 100% auto;
	}

	.main {
		width: 100%;
		position: relative;
		margin-top: 10px;
	}

	.yun {
		position: absolute;
		top: -3%;
		left: 0;
		width: 44%;
		z-index: 9;
	}

	.box {
		position: relative;
		height: calc(100vh - 97px);
		overflow-y: scroll;
		background: url(http://image.qxgm.site/tdz/img/public/ping2.png);
		background-size: 100% auto;
		padding: 10px 6px 0;
		border-bottom: 6px solid #b0a3a1;
	}

	.ping1 {
		width: 100%;
		display: flex;
	}

	.rightbox {
		width: 76px;

		.erweima {
			width: 100%;
		}
	}

	.info {
		background: #f9f6f7;
		border: 5px solid #b0a3a1;
		margin-bottom: 3px;
		padding: 7px 9px 8px;
	}

	.sbox {
		display: flex;
		align-items: center;
		justify-content: space-between;
		height: 100%;
	}

	.rightbox2 {
		width: 80px;
		text-align: center;
		background: url(http://image.qxgm.site/tdz/img/shiming/mg-02.png) no-repeat;
		background-size: 100% 100%;
		padding: 9% 10px;
		box-sizing: border-box;

		.erweima {
			width: 100%;
		}

		text {
			font-size: 14px;
			font-weight: normal;
			color: #8b7881;
			line-height: 14px;
			margin-top: 10px;
		}
	}

	.simg {
		width: 22%;
	}

	.pimg {
		width: 55px;
	}

	.p1 {
		font-size: 17px;
		font-weight: normal;
		color: #333333;
		line-height: 17px;
		margin-bottom: 11px;
	}

	.p2 {
		font-size: 14px;
		font-weight: normal;
		color: #333333;
		line-height: 14px;
		margin-bottom: 7px;
	}

	.p3 {
		font-size: 12px;
		font-weight: normal;
		color: #333333;
		line-height: 16px;
	}

	.yboj {
		display: flex;
		align-items: center;
		justify-content: space-between;
		margin-top: 9px;

		.bmb {
			font-size: 16px;
			font-weight: normal;
			color: #000000;
			line-height: 24px;

			text {
				color: #FF0099;
			}
		}
	}

	.copy {
		width: 41%;
		text-align: center;
		font-size: 14px;
		font-weight: normal;
		height: 33px;
		color: #fdf4c6;
		text-shadow: 0 1px 1px #CB6500;
		line-height: 33px;
		background: url(http://image.qxgm.site/tdz/img/public/anniu.png) no-repeat;
		background-size: 100% 100%;
	}

	.link {
		display: flex;
		align-items: center;
		justify-content: space-between;
		background: url(http://image.qxgm.site/tdz/img/xianyu/mg-06.png) no-repeat;
		background-size: 100% 100%;
		padding: 10px 12px;
		box-sizing: border-box;
		margin-top: 6px;
	}

	.jobx {
		flex: 1;
		margin-left: 6px;
	}

	.jp1 {
		font-size: 14px;
		font-weight: normal;
		color: #333333;
		line-height: 14px;
	}

	.jp2 {
		font-size: 12px;
		font-weight: normal;
		color: #333333;
		line-height: 12px;
		margin-top: 10px;
	}

	.getLevel {
		width: 93px;
		text-align: center;
		font-size: 14px;
		font-weight: normal;
		height: 33px;
		color: #fdf4c6;
		text-shadow: 0 1px 1px #CB6500;
		line-height: 33px;
		background: url(http://image.qxgm.site/tdz/img/public/anniu.png) no-repeat;
		background-size: 100% 100%;
	}

	.hui {
		color: #FF3399;
	}

	.tis {
		font-size: 15px;
		font-weight: normal;
		color: #333333;
		line-height: 24px;
	}

	.part {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 10px 12px 12px;
		box-sizing: border-box;
		background: url(http://image.qxgm.site/tdz/img/xianyu/mg-06.png) no-repeat;
		background-size: 100% 100%;
		margin-bottom: 3px;
	}

	.pbox {
		flex: 1;
		margin-left: 10px;
	}

	.loginimg {
		width: 100%;
		position: relative;
		left: 50%;
		top: 50%;
		transform: translate(-50%, -50%);

		.img {
			display: block;
			margin: 0 auto;
			width: 50%;
		}

		.shpj {
			font-size: 14px;
			color: #fff;
			font-weight: normal;
			line-height: 14px;
			text-align: center;
			margin-top: 10px;
		}
	}
</style>